<template>
  <view class="data-source-manager">
    <view class="header">数据源管理</view>
    <view class="source-list">
      <view 
        v-for="(source, index) in dataSources" 
        :key="index" 
        class="source-item"
        :class="{ 'active': source.enabled }"
        @click="toggleSource(index)"
      >
        <text class="source-name">{{ source.name }}</text>
        <switch 
          :checked="source.enabled" 
          @change="toggleSource(index)" 
          color="#007AFF"
        />
      </view>
    </view>
  </view>
</template>

<script>
export default {
  name: 'DataSourceManager',
  data() {
    return {
      dataSources: [
        { name: '官方场地数据', enabled: true },
        { name: '第三方数据源1', enabled: false },
        { name: '第三方数据源2', enabled: true }
      ]
    }
  },
  methods: {
    toggleSource(index) {
      this.dataSources[index].enabled = !this.dataSources[index].enabled
      // 这里可以添加保存到本地存储的逻辑
      uni.setStorageSync('dataSources', this.dataSources)
    }
  },
  mounted() {
    // 从本地存储加载数据源设置
    const savedSources = uni.getStorageSync('dataSources')
    if (savedSources) {
      this.dataSources = savedSources
    }
  }
}
</script>

<style scoped>
.data-source-manager {
  padding: 20rpx;
}

.header {
  font-size: 36rpx;
  font-weight: bold;
  margin-bottom: 30rpx;
}

.source-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20rpx;
  border-bottom: 1rpx solid #eee;
}

.source-item.active {
  background-color: #f0f8ff;
}

.source-name {
  font-size: 28rpx;
}
</style>